<% include file="header.html" %>
		<style type="text/css">
		/* Undo some styles from the master stylesheet */
		.checklist li { background: none; padding-left: 0; list-style:none; list-style-image:none;}
		
		/* CSS for checklists */
		.checklist {
			border: 1px solid #ccc;
			list-style: none;
			height: 10em;
			overflow: auto;
			width: 16em;
		}
		.checklist, .checklist li { margin-left: 0; padding: 0; }
		.checklist label { display: block; padding-left: 25px; text-indent: -25px; }
		.checklist label:hover, .checklist label.hover { background: #777; color: #fff; }
		* html .checklist label { height: 1%; }
		
		/* Checklist 1 */
		.cl1 { font-size: 0.9em; width: 100%; height: 15em; }
		.cl1 .alt { background: #f5f5f5; }
		.cl1 input { vertical-align: top; }
		.cl1 label:hover, .cl1 label.hover { background: #ddd; color: #000; }

	</style>
	
	<!-- JavaScript -->
	<script type="text/javascript">
		/*-----------------------------------------------------------+
		 | addLoadEvent: Add event handler to body when window loads |
		 +-----------------------------------------------------------*/
		function addLoadEvent(func) {
			var oldonload = window.onload;
			
			if (typeof window.onload != "function") {
				window.onload = func;
			} else {
				window.onload = function () {
					oldonload();
					func();
				}
			}
		}
		
		/*------------------------------------+
		 | Functions to run when window loads |
		 +------------------------------------*/
		addLoadEvent(function () {
			initChecklist();
		});
		
		/*----------------------------------------------------------+
		 | initChecklist: Add :hover functionality on labels for IE |
		 +----------------------------------------------------------*/
		function initChecklist() {
			if (document.all && document.getElementById) {
				// Get all unordered lists
				var lists = document.getElementsByTagName("ul");
				
				for (i = 0; i < lists.length; i++) {
					var theList = lists[i];
					
					// Only work with those having the class "checklist"
					if (theList.className.indexOf("checklist") > -1) {
						var labels = theList.getElementsByTagName("label");
						
						// Assign event handlers to labels within
						for (var j = 0; j < labels.length; j++) {
							var theLabel = labels[j];
							theLabel.onmouseover = function() { this.className += " hover"; };
							theLabel.onmouseout = function() { this.className = this.className.replace(" hover", ""); };
						}
					}
				}
			}
		}
	</script>
		<div id="main-content"> <!-- Main Content Section with everything -->
			
			<!-- Page Head -->
			<h2>图片广告</h2><p class="clear"></p>
			
			
			<ul class="shortcut-buttons-set" style="display:none;">
				
				<li><a class="shortcut-button" href="#"><span>
					<img src="images/icons/pencil_48.png" alt="icon" /><br />
					Write an Article
				</span></a></li>
				
				<li><a class="shortcut-button" href="#"><span>
					<img src="images/icons/paper_content_pencil_48.png" alt="icon" /><br />
					Create a New Page
				</span></a></li>
				
				<li><a class="shortcut-button" href="#"><span>
					<img src="images/icons/image_add_48.png" alt="icon" /><br />
					Upload an Image
				</span></a></li>
				
				<li><a class="shortcut-button" href="#"><span>
					<img src="images/icons/clock_48.png" alt="icon" /><br />
					Add an Event
				</span></a></li>
				
				<li><a class="shortcut-button" href="#messages" rel="modal"><span>
					<img src="images/icons/comment_48.png" alt="icon" /><br />
					Open Modal
				</span></a></li>
				
			</ul><!-- End .shortcut-buttons-set -->
			
			<div class="clear"></div> <!-- End .clear -->
			
			<div class="content-box"><!-- Start Content Box -->
				
				<div class="content-box-header">
					
					<h3>完善图片广告投放</h3>
					<div class="clear"></div>
					
				</div> <!-- End .content-box-header -->
				
				<div class="content-box-content">
					
					<div class="tab-content default-tab font_14" id="tab2">
						<div class="notification attention png_bg">
                            <a href="#" class="close"><img src="images/icons/cross_grey_small.png" title="Close this notification" alt="close" /></a>
                            <div>当前操作的提示以及警告信息！</div>
                
						</div>
						<form action="#" method="post" id="myform">
							
							<fieldset> <!-- Set class to "column-left" or "column-right" on fieldsets to divide the form into columns -->
								<script type="text/javascript" src="uploadify/swfobject.js"></script>
								<script type="text/javascript" src="uploadify/jquery.uploadify.v2.1.4.min.js"></script>
								<script type="text/javascript">
								// <![CDATA[
								$(document).ready(function() {
								  $('#file_upload_pic').uploadify({
								    'uploader'  : 'uploadify/uploadify.swf',
								    'script'    : 'uploadify/uploadify.php',
								    'cancelImg' : 'uploadify/cancel.png',
								    'folder'    : 'upload_file/image',
								    'auto'      : true,
								    'fileExt'     : '*.png;*.gif;*.jpg;',
								    'fileDesc'    : 'Files Type (.png, .gif, .jpg)',
								    'buttonText': 'ICON',
								    'onComplete'  : function(event, ID, fileObj, response, data) {
								    	//把上传图片路径赋值到页面中pic_url元素中。
								    	$('#pic_url').val(response);
								     },
								     'onError'     : function (event,ID,fileObj,errorObj) {
								         alert(errorObj.type + ' Error: ' + errorObj.info);
								       }
								  });
								  
								  $('#file_upload_bg').uploadify({
									    'uploader'  : 'uploadify/uploadify.swf',
									    'script'    : 'uploadify/uploadify.php',
									    'cancelImg' : 'uploadify/cancel.png',
									    'folder'    : 'upload_file/image',
									    'auto'      : true,
									    'fileExt'     : '*.png;*.gif;*.jpg;',
									    'fileDesc'    : 'Files Type (.png, .gif, .jpg)',
									    'buttonText': 'Background',
									    'onComplete'  : function(event, ID, fileObj, response, data) {
									    	$('#bg_url').val(response);
									     },
									     'onError'     : function (event,ID,fileObj,errorObj) {
									         alert(errorObj.type + ' Error: ' + errorObj.info);
									       }
									  });
								});
								// ]]>
								</script>
                                <label class="font_14">定义图片广告素材</label>
								<input type="hidden" name="id" value="<% $obj->id %>" />
								<div class="clear2" style="position:relative;"><div class="row_name">小图标：</div><input id="file_upload_pic" type="file" name="file_upload_pic" style="dis" /><div style=" position:absolute; left:200px; top:5px;"><span style="font-size:12px; color:#999;">&nbsp;请用透明背景图标，建议宽度89px</span></div></div>
								<div class="clear2" style="position:relative;"><div class="row_name">背景图片：</div><input id="file_upload_bg" type="file" name="file_upload_bg" /><div style=" position:absolute; left:200px; top:5px;"><span style="font-size:12px; color:#999;">&nbsp;请用490x1的背景图片</span></div></div>
								<input type="hidden" name="pic_url" id="pic_url" value="<% $obj->pic_url %>" />
								<input type="hidden" name="bg_url" id="bg_url" value="<% $obj->bg_url %>" />
								
								<div class="clear2">
									<div class="row_name">投放名称：</div>
									<input class="text-input little-input" style="width:400px !important;" type="text" name="name" id="name" value="<% $obj->name %>" />
								</div>
								
								<div class="clear2">
									<div class="row_name">广告主：</div>
									<input class="text-input little-input" style="width:400px !important;" type="text" name="order" id="order" value="<% $obj->order %>" />
								</div>
								
								<script type="text/javascript">
								   $(document).ready(function() {
								     $('#colorpicker_text').farbtastic('#text_color');
								     $('#colorpicker_content').farbtastic('#content_color');
								   });
								 </script>								
								
								<div class="clear2">
									<div class="row_name">广告标题：</div>
									<input class="text-input little-input" style="width:400px !important;" type="text" name="text" id="text" value="<% $obj->text %>" onkeydown="javascript:checkTitleLength();" onkeyup="javascript:checkTitleLength();"/>
									<span id="inputTitleNumber"></span>
								</div>
								
								<div class="clear2">
									<div class="row_name">标题颜色：</div>
									<input class="text-input little-input" type="text" name="text_color" id="text_color" value="<% if $obj->text_color=='' %>#123456<% else %><% $obj->text_color %><% /if %>"/>
									 <div id="colorpicker_text"></div>
								</div>
								
								<div class="clear2">
									<div class="row_name">标题字体：</div>
									<select name="text_size" id="text_size">
										<% section name=obj loop=$sizeCount %>
										<option value="<% $smarty.section.obj.index+10 %>" <% if $obj->text_size ==  ($smarty.section.obj.index+10) %>selected="true"<% /if %> ><% $smarty.section.obj.iteration+10  %></option>
										<%/section %>
									</select>&nbsp;px
								</div>
								
								<div class="clear2">
									<div class="row_name">广告内容：</div>
									<input class="text-input little-input" style="width:400px !important;" type="text" name="content" id="content" value="<% $obj->content %>" onkeydown="javascript:checkLength();" onkeyup="javascript:checkLength();"/>
									<span id="inputNumber"></span>
								</div>
								
								<div class="clear2">
									<div class="row_name">内容颜色：</div>
									<input class="text-input little-input" type="text" name="content_color" id="content_color" value="<% if $obj->content_color=='' %>#123456<% else %><% $obj->content_color %><% /if %>"/>
									 <div id="colorpicker_content"></div>
								</div>
								
								<div class="clear2">
									<div class="row_name">内容字体：</div>
									<select name="content_size" id="content_size">
										<% section name=obj loop=$sizeCount %>
										<option value="<% $smarty.section.obj.index+10 %>" <% if $obj->content_size ==  ($smarty.section.obj.index+10) %>selected="true"<% /if %> ><% $smarty.section.obj.iteration+10  %></option>
										<%/section %>
									</select>&nbsp;px
								</div>
								
								<div class="clear2">
									<div class="row_name">点击地址：</div>
									<input class="text-input little-input" style="width:400px !important;" type="text" name="out_url" id="out_url" value="<% $obj->out_url %>"/>
								</div>
																
								<div class="clear2">
									<div class="row_name">广告样式：</div>
									<select name="TBD">
										<option value="1" <% if $obj->TBD == 1 %>selected="true"<% /if %> >1</option>
										<option value="2" <% if $obj->TBD == 2 %>selected="true"<% /if %> >2</option>
										<option value="3" <% if $obj->TBD == 3 %>selected="true"<% /if %> >3</option>
									</select>
								</div>
                                <label class="font_14" style="margin-top:20px;">定义图片广告投放</label>
                                <div class="clear2"><div class="row_name">排期：</div><input class="text-input little-input" type="text" name="start" id="start" value="<% $obj->start %>" onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:00:00'})" /> <!-- Classes for input-notification: success, error, information, attention -->&nbsp;&nbsp;至&nbsp;&nbsp;<input class="text-input little-input" type="text" name="end" id="end" value="<% $obj->end %>" onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:00:00'})" /> <!-- Classes for input-notification: success, error, information, attention --></div>
                                <div class="clear2"><div class="row_name">设置权重：</div><input class="text-input little-input" type="text" name="weight" id="weight" value="<% $obj->weight %>"/> <!-- Classes for input-notification: success, error, information, attention --></div>
                                <div class="clear2"><div class="row_name">投放量：</div><input class="text-input little-input" type="text" name="num" id="num" value="<% $obj->num %>"/> <!-- Classes for input-notification: success, error, information, attention --></div>
                                
                                <style>
										.scroll_checkboxes {
										    height: 20px;
											width: 200px;
										    padding: 5px;
										    overflow: auto;
										    border: 1px solid #ccc
										}
								</style>
                                
                                <div class="clear2">
                                	<div class="row_name" style="width:100px;">选择投放标签：</div>
                                    <div class="clear" style="line-height:36px;">
                                    <table style="margin-bottom:12px;">
                                    	<tr style="background:none; margin-bottom:5px;">
                                        	<td class="row_name"  valign="top" style="line-height:24px;">Channel：</td>
                                            <td>
                                            		
                                            	<ul class="checklist cl1" style="width:300px; padding-top:0;max-height:126px; height:auto; padding-bottom:0;">
                                                        	<% section name=obj loop=$channelList %>
                                                            	<li class="alt" style=" background:none;padding-left:10px;">
                                                                	<label for="a1" style="padding-bottom:0;"><input type="checkbox" name="channel[]" value="<% $channelList[obj].name %>" <% $channelList[obj].select %> />&nbsp;<% $channelList[obj].name %> &nbsp;</label>
                                                                </li>
                                                            <%/section %>
                                                </ul>
                                            </td>
                                        </tr>
                                     </table>
                                     <table style="margin-bottom:12px;">
                                        <tr style="background:none; margin-bottom:5px;">
                                        	<td class="row_name"  valign="top" style="line-height:24px;">Class：</td>
                                            <td>
                                            		<ul class="checklist cl1" style="width:300px; padding-top:0; height:126px;">
                                                        	<% section name=obj loop=$classList %>
                                                            	<li class="alt" style=" background:none;padding-left:10px;">
                                                                	<label for="a1" style="padding-bottom:0;"><input  type="checkbox" name="class[]" value="<% $classList[obj].name %>" <% $classList[obj].select %> /><% $classList[obj].name %> &nbsp;</label>
                                                                </li>
                                                            <%/section %>
                                                      </ul>
                                            </td>
                                        </tr>
                                    </table>
                                    <table style="margin-bottom:12px;">
                                        <tr style="background:none; margin-bottom:5px;">
                                        	<td class="row_name"  valign="top" style="line-height:24px;">Brand：</td>
                                            <td>
                                                    	<ul class="checklist cl1" style="width:300px; padding-top:0; height:126px;">
                                                        	<% section name=obj loop=$brandList %>
                                                            	<li class="alt" style=" background:none; padding-left:10px;">
                                                                	<label for="a1" style="padding-bottom:0;"><input  type="checkbox" name="brand[]" value="<% $brandList[obj].name %>" <% $brandList[obj].select %> />&nbsp;<% $brandList[obj].name %> &nbsp;</label>
                                                                </li>
                                                            <%/section %>
                                                      </ul>
                                       				 
                                            </td>
                                        </tr>
                                    </table>
                                    <table style="margin-bottom:12px;">
                                        <tr style="background:none; margin-bottom:5px;">
                                        	<td class="row_name"  valign="top" style="line-height:24px;">
                                            	Tag：
                                            </td>
                                            <td>
                                            		<ul class="checklist cl1" style="width:300px; padding-top:0; height:126px;">
                                                        	<% section name=obj loop=$tagList %>
                                                            	<li class="alt" style=" background:none;padding-left:10px;">
                                                                	<label for="a1" style="padding-bottom:0;"><input  type="checkbox" name="tag[]" value="<% $tagList[obj].name %>" <% $tagList[obj].select %> />&nbsp;<% $tagList[obj].name %> &nbsp;</label>
                                                                </li>
                                                            <%/section %>
                                                      </ul>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                </div>
                                <script type="text/javascript">
								$(document).ready(function(){
									$("#callotherkws").click(function(){
										$.post(
												"?do=pic.searchPics",
												{
													'channel':getCheckboxValue('channel[]'),
													'class':getCheckboxValue('class[]'),
													'brand':getCheckboxValue('brand[]'),
													'tag':getCheckboxValue('tag[]'),
												},
												function(data){
													$("#picnum").val(data);
												}                         
											 );
									})
								});
								</script>
                                <p>
                                	<div class="row_name" style="text-align:left; line-height:20px; margin-top:-8px; width:78px; margin-left:-4px;">匹配到的图片数：</div>
									<input class="text-input little-input" type="text" name="picnum"  id="picnum" value=""  readonly="readonly" />
									<input id="callotherkws" class="button" type="button" value="搜索" style="margin-left:24px;" />
                                </p>
								
								<p>
									<input class="button" type="button" value="预览"  onclick="javascript:previewofpicinsert()" style="margin-left:74px;" />
									<% if $op=='add' %>
									<input class="button" type="submit" value="完成"  onclick="fromsubmit('pic','add')" style="margin-left:40px;" />
									<%else%>
									<input class="button" type="submit" value="完成"  onclick="fromsubmit('pic','modify')" style="margin-left:40px;" />
									<%/if%>
								</p>
							</fieldset>
							
							<div class="clear"></div><!-- End .clear -->
							
						</form>
						
					</div> <!-- End #tab2 -->        
					
				</div> <!-- End .content-box-content -->
				
			</div> <!-- End .content-box -->
			<div id="dialog-modal" title="preview">
			<div class="clear"></div>
			
<% include file="footer.html" %>